<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<!-- 获取应用上下文路径 -->
<c:set var="ctx" value="${pageContext.request.contextPath}" />

<!-- 设置全局变量 -->
<script>
    // 设置应用上下文路径
    window.CONTEXT_PATH = '${ctx}';
</script>

<!-- 引入配置文件 -->
<script src="${ctx}/static/js/config.js"></script>
<script src="${ctx}/static/js/common.js"></script>



<!-- 通用导航栏 -->
<nav class="navbar navbar-expand-lg navbar-dark bg-primary">
    <div class="container">
        <a class="navbar-brand" href="${ctx}/page/index">
            <i class="fas fa-store me-2"></i>商品评价系统
        </a>
        
        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav">
            <span class="navbar-toggler-icon"></span>
        </button>
        
        <div class="collapse navbar-collapse" id="navbarNav">
            <ul class="navbar-nav me-auto">
                <li class="nav-item">
                    <a class="nav-link" href="${ctx}/page/index">首页</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link" href="${ctx}/page/products">商品列表</a>
                </li>
            </ul>
            
            <ul class="navbar-nav" id="userNav">
                <!-- 未登录状态 -->
                <li class="nav-item d-none" id="loginNav">
                    <a class="nav-link" href="${ctx}/page/login">登录</a>
                </li>
                <li class="nav-item d-none" id="registerNav">
                    <a class="nav-link" href="${ctx}/page/register">注册</a>
                </li>
                
                <!-- 已登录状态 -->
                <li class="nav-item dropdown d-none" id="userDropdown">
                    <a class="nav-link dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown">
                        <i class="fas fa-user me-1"></i>
                        <span id="usernameDisplay"></span>
                    </a>
                    <ul class="dropdown-menu">
                        <li><a class="dropdown-item" href="${ctx}/page/user-center">个人中心</a></li>
                        <li><hr class="dropdown-divider"></li>
                        <li><a class="dropdown-item" href="#" onclick="logout()">退出登录</a></li>
                    </ul>
                </li>
            </ul>
        </div>
    </div>
</nav>

<script>
// 通用的用户状态检查和导航栏更新
function updateNavbar() {
    apiRequest({
        url: AppConfig.APIS.USER.CURRENT,
        type: 'GET',
        success: function(response) {
            if (response.success && response.data) {
                // 用户已登录
                $('#loginNav, #registerNav').addClass('d-none');
                $('#userDropdown').removeClass('d-none');
                $('#usernameDisplay').text(response.data.username);
            } else {
                // 用户未登录
                $('#userDropdown').addClass('d-none');
                $('#loginNav, #registerNav').removeClass('d-none');
            }
        },
        error: function() {
            // 请求失败，显示登录按钮
            $('#userDropdown').addClass('d-none');
            $('#loginNav, #registerNav').removeClass('d-none');
        }
    });
}

// 通用的退出登录方法
function logout() {
    apiRequest({
        url: AppConfig.APIS.USER.LOGOUT,
        type: 'POST',
        success: function(response) {
            if (response.success) {
                goToPage(AppConfig.PAGES.INDEX);
            }
        }
    });
}

// 页面加载完成后更新导航栏
$(document).ready(function() {
    updateNavbar();
});
</script>